05. Exercise: Add TextView Attributes

Now it’s your turn to complete this exercise yourself.

Make sure you've looked at the starter app to see how the UI looks before we add our awesome new design.

In this exercise, you’ll begin your Material Design journey by changing the style of the header view using attributes.

1. Review the original layout.

Open up home_fragment.xml and have a look at the layout. It’s just a ConstraintLayout with a few images and some unstyled TextViews.


2. Change the size of the title and subtitle.

In home_fragment.xml, add textSize attributes to the TextViews. The subtitle should be smaller than the title.

 <TextView
       android:id="@+id/title"
       android:textSize="24sp" />

 <TextView
       android:id="@+id/subtitle"
       android:textSize="18sp"/>

3. Add a textColor attribute to change the text color to dark gray.

Here’s how the new attributes should look in your TextViews:

 <TextView
       android:id="@+id/title"
       android:textColor="#555555"
       android:textSize="24sp" />
 <TextView
       android:id="@+id/subtitle"
       android:textColor="#555555"
       android:textSize="18sp"/>

Finally, run your code and make sure you see that the text is larger and the dark gray.

If you want to start at this step, you can download this exercise from: Step.01-Exercise-Add-TextView-Attributes.

You will find plenty of //TODO comments to help you complete this exercise, and if you get stuck, go back and watch the video again.

Once you’re done, you can check your solution against the solution we’ve provided here: Step.01-Solution-Add-TextView-Attributes, or using this git diff.

Reference documentation

• TextView XML Attributes